<template>
  <commonDialog :model-value="modelValue" @close="cancel" :showSure="false" title="统计日报报表信息" size="50%">
    <el-form :inline="true">
      <el-form-item label="填报开始时间">
        <el-date-picker format="YYYY-MM-DD"
                        v-model="request.fillBeginDate" value-format="YYYY-MM-DD" type="date"
                        placeholder="请选择填报开始时间"/>
      </el-form-item>
      <el-form-item label="填报结束时间">
        <el-date-picker format="YYYY-MM-DD"
                        v-model="request.fillOverDate" value-format="YYYY-MM-DD" type="date"
                        placeholder="请选择填报结束时间"/>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="search" icon="Search">搜索</el-button>
        <el-button type="primary" @click="exportFile" icon="Download">导出日报报表</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="state.list" border stripe height="250">
      <el-table-column prop="trueName" label="用户姓名"/>
      <el-table-column label="已填报次数" prop="fillCount"></el-table-column>
    </el-table>
  </commonDialog>
</template>

<script>
import { propsConst } from '@/utils/propsConstant'
import { exportStatisticsDailyUrl, queryStatisticsDailyListUrl } from '@/api/api'
import { commonPostDownloadFile, post } from '@/utils/httpRequest'
import { onBeforeMount, ref } from 'vue'
import { getCurrentDate } from '@/utils/util'

export default {
  name: 'statisticsDailyList',
  setup (props, { emit }) {
    console.log(props)
    const state = ref({
      list: []
    })
    const exportFile = async () => {
      await commonPostDownloadFile(exportStatisticsDailyUrl, request.value)
    }
    const request = ref({
      fillBeginDate: getCurrentDate(),
      fillOverDate: null
    })
    const search = () => {
      queryStatisticsDailyListAsync()
    }
    const queryStatisticsDailyListAsync = async () => {
      const result = await post(queryStatisticsDailyListUrl, request.value)
      if (result.code === 200) {
        state.value.list = result.data
      }
    }
    const cancel = () => {
      emit('update:modelValue', false)
    }
    onBeforeMount(() => {
      queryStatisticsDailyListAsync()
    })
    return {
      exportFile,
      state,
      request,
      cancel,
      search
    }
  },
  props: propsConst
}
</script>

<style scoped>

</style>
